<template>
  <div>
    <button type="button" @click="toNews">看新闻</button>
    <h3>VueCli的学习</h3>
    <h3>再来一行</h3>
    <p>Info</p>
  </div>
</template>

<script>

export default {
  name: "InfoView",
  data() {
    return {}
  },
  methods:{
    toNews(){
      console.log(this.$router)//项目中整个路由对象的信息，他可以进行页面的跳转和传参的功能
      console.log(this.$route)//当前路由对象的信息

      /*编程式路由跳转*/
      // this.$router.push("/xinwen?age=18&name=uzi&sex=man");/*方法内直接给字符串地址，则整个地址就只能是路由设置中的path的值*/
      // this.$router.push({path:"/xinwen"})/*以对象的方式使用path跳转地址*/
      /*跳转的参数中，name和path同时存在的时候，name的优先级更高*/
      this.$router.push({path:"/xinwen",name:"liudehua2",params:{name:"刘德华"}})/*以对象的方式使用name跳转地址*/

      /*name和path有什么区别吗？
      * path方式跳转可以使用query方式传参
      * name方式跳转可以使用params方式传参
      *
      *
      * */
    }
  }
}
</script>

<style scoped>

</style>
